<script setup lang="ts">
import Footer from "@/components/Footer.vue";
import Header from '@/components/Header.vue'
import { RouterView } from 'vue-router'
</script>

<template>
  <div class="main">
      <div class="header">
        <Header></Header>
      </div>
      <div class="content">
        <RouterView />
      </div>
      <div class="footer">
           <Footer></Footer>
      </div>
  </div>
</template>

<style scoped>
* {
  margin: 0;
  padding: 0;
}

.main {
  height: 97vh;
  width: 100%;
}
.content{
    height: 80%;
}
.header {
  background: deepskyblue;
}

.footer {
  background: wheat;
  height: 10%;
}
</style>